<% include ../layouts/navigation-bar %>

<main class="container general-container">
    <div class="row h-100">
        <div class="col-12 my-auto">
            <% include ../layouts/flash-message %>
            <% include ../layouts/wait %>
            <div id="custom-upload-input" class="custom-input">
                <form id="form-upload">
                    <h6 id="ipfsFile">IPFS File <small>(max size 15 MB)</small></h6>
                    <div class="box-input upload-drop-zone text-center">
                        <div class="box-form">
                            <img src="images/general/upload.png" class="image-src img-thumbnail" id="image-preview">
                            <p id="file-name" class="d-none"></p>
                            <input class="box-file invisible" type="file" name="imageFile" id="file-hidden"/>
                            <p id="file-label"><button id="file-preview" class="box-button btn btn-primary" type="button"><i class="far fa-image"></i>  Choose a file</button><strong class="box-dragndrop"> or drag it here</strong></p>
                        </div>
                    </div>
                    <div id="radio-button-input" class="margin-custom-radio">
                        <h6>Encrypt file?</h6>
                        <div class="custom-control custom-radio">
                            <input type="radio" id="customRadio1" name="encrypt" class="custom-control-input" value="true">
                            <label class="custom-control-label" for="customRadio1">Yes</label>
                        </div>
                        <div class="custom-control custom-radio">
                            <input type="radio" id="customRadio2" name="encrypt" class="custom-control-input" value="false">
                            <label class="custom-control-label" for="customRadio2">No</label>
                        </div>
                    </div>
                    <div id="keys-text-box" class="d-none">
                        <div class="input-group margin-custom-radio">
                            <h6>Sender Private Key</h6>
                            <input id="sender-private-key" type="text" name="senderPrivateKey" class="search-query form-control" placeholder="Paste the private key of the sender" />
                        </div>
                        <div class="input-group margin-custom-radio">
                            <h6>Receiver Public Key</h6>
                            <input id="receiver-public-key" type="text" name="receiverPublicKey" class="search-query form-control" placeholder="Paste the public key of the receiver to encrypt the file" />
                        </div>
                    </div>
                    <button id="btn-upload" class="box-button btn btn-primary margin-custom-radio float-right" type="button"><i class="fas fa-cloud-upload-alt"></i> Upload</button>
                </form>	
            </div>
            <div id="image-hash-box" class="d-none">
                <p><strong id="ipfs-label">  </strong><i id="ipfs-btn" class="fas fa-paste js-tooltip js-copy" aria-hidden="true" data-toggle="tooltip" data-placement="bottom" data-copy="" title="Copy to clipboard"></i></strong></p>
                <p class="p-word-break"><span id="image-hash" class="ajax-text-message"></span></p>
            </div>
        </div>
    </div>
</main>

<% include ../layouts/footer %>